/* 内容 */
#content{
    width: 1200px;
    margin: auto;
    
}
/* 内容中的推荐部分 */
#recommend{    /* 标题  */
    margin-top: 20px;
    font-size: 24px;
    font-weight: 700;
    padding: 10px 0;
    border-bottom: 3px solid black;
}
#content_recommend{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 50px;
    border: 1px solid #e6e6e6;
}
/* 设置每一个可以秒杀图书的样式 */
.info{
    width: 200px;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    
    padding-bottom: 20px;
}
.info > a >img{  
    width: 200px;
    height: 200px;
    background-color: black;
}
.name{
    width: 100%;
    height: 20px;
    overflow: hidden;
    margin-left: 5px;
}
.name > a{
    color: black;
    font-size: 14px;
}
.name > a:hover{
    color:red;
    text-decoration-line: underline;
}
.price{
    color: red;
    display: flex;
    font-size: 14px;
    align-items: flex-end;
    margin-left: 5px;
    padding: 5px 0;
}
.price > span:first-child{
    margin-right: 5px;
}
.price > span:last-child{
    display: flex;
    color: black;
    font-size: 12px;
    text-decoration-line: line-through;
    flex: 1;
}
/* 内容中的所有图书 */
#book{    
    font-size: 24px;
    font-weight: 700;
    padding: 10px 0;
    display: flex;
    border-bottom: 3px solid black;
}
#content_book{
    display: flex;
    justify-content: space-between;
    align-content: flex-start;   
    
}
/* 设置图书中的图片 */
.content_pic{
    display: flex;
    width: 870px;
    justify-content: flex-start;
    align-content: flex-start;
    flex-wrap: wrap;
    border: 1px solid #e6e6e6;
}
.content_pic > a >img{
    width: 200px;
    height: 200px;
}
.rank{
    display: flex;
    justify-content: center;
    align-content: center;
    margin-right: 5px;
    width: 300px;
    border: 1px solid black;
}
.rank >span{
    display: flex;
    justify-content: center;
    align-content: center;
    width: 50%;
    padding: 10px 20px;
    border: 1px solid black;
}
#rank_content{
    width: 100%;
    border: 1px solid #e6e6e6;
}
#rank_content > div{
    width: 100%;
    padding: 5px 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
/* 设置所有的span标签 */
#rank_content > div > span{
    color:black;
    font-size: 14px;
    padding: 5px 10px;
}
#rank_content > div:first-child > span:first-child{
    
    color: red;
}
#rank_content > div:nth-child(2) > span:first-child{
    color: orange;
}
#rank_content > div:nth-child(3) > span:first-child{
    color: magenta;   
}
#rank_content > div > span:last-child{
    width: 100%;
    border-bottom: 1px solid #e6e6e6;
}
#rank_content > div > span > a{
	display: inline-block;
  	white-space: nowrap; 
  	color: black;
  	width: 100px; 
  	overflow: hidden;
  	text-overflow:ellipsis;
}
#rank_content > div > span > a:hover{
	color:red;
	text-decoration: underline;
}
/* 内容中的所有电子书图书 */
#ebook{
    font-size: 24px;
    font-weight: 700;
    padding: 10px 0;
    
    margin-top: 50px;
    border-bottom: 3px solid black;
    display: flex;
}
#content_ebook{
    display: flex;
    flex-direction: column;
}
#ebook_pic{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    border: 1px solid #e6e6e6;
}
#ebook_pic > a> img{
    width: 300px;
    height: 200px;
}
/* 内容中的所有网络文学 */
#obook{
    font-size: 24px;
    font-weight: 700;
    padding: 10px 0;
    
    margin-top: 50px;
    border-bottom: 3px solid black;
    display: flex;
}
#content_obook{
    display: flex;
    flex-direction: column;
}
#obook_pic{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    border: 1px solid #e6e6e6;
}
#obook_pic > a> img{
    width: 300px;
    height: 200px;
}
/* 内容中的所有户外运动 */
#sport{
    font-size: 24px;
    font-weight: 700;
    padding: 10px 0;
    
    margin-top: 50px;
    border-bottom: 3px solid black;
    display: flex;
}
#content_sport{
    display: flex;
    flex-direction: column;
}

#sport_pic{
    width: 100%;
    display: flex;
    align-items: center;
    font-size: 50px;
}
#sport_pic>  img{
    width: 300px;
    height: 200px;
    margin-right: 50px;
}
/* 内容中的所有家居 */
#house{
    font-size: 24px;
    font-weight: 700;
    padding: 10px 0;
    border-bottom: 3px solid black;
    margin-top: 50px;
    display: flex;
}
#content_house{
    display: flex;
    flex-direction: column;
}
#house_pic{
    width: 100%;
    display: flex;
    align-items: center;
    font-size: 50px;
}
#house_pic>  img{
	width: 300px;
    height: 200px;
    margin-right:50px;
}
/* 内容中的所有食品 */
#food{
    font-size: 24px;
    font-weight: 700;
    padding: 10px 0;
    
    margin-top: 50px;
    border-bottom: 3px solid black;
    display: flex;
}
#content_food{
    display: flex;
    flex-direction: column;
}
#food_pic{
    width: 100%;
    display: flex;
    align-items: center;
    font-size: 50px;
}
#food_pic>  img{
    width: 300px;
    height: 200px;
    margin-right:50px;
}
/* 内容中的所有电器城 */
#emall{
    font-size: 24px;
    font-weight: 700;
    padding: 10px 0;
    
    margin-top: 50px;
    border-bottom:3px solid black;
    display: flex;
}
#content_emall{
    display: flex;
    flex-direction: column;
}
#emall_pic{
    width: 100%;
    display: flex;
    align-items: center;
    font-size: 50px;
}
#emall_pic> img{
	width: 300px;
    height: 200px;
    margin-right:50px;
 }